<template>
<div>
  <div class="container main">
    <!-- 投资合作 -->
    <div class="investment">
      <div class="stment">
        <div class="form-group">
          <span class="com-search">企业查询</span>
          <div class="col-sm-6 stment_search">
            <input
              type="email"
              class="form-control"
              id="inputEmail3"
              placeholder="请输入关键字"
            />
          </div>
          <div class="col-sm-2">
            <button class="btn btn-primary" type="button" @click="search" >搜索</button>
          </div>
        </div>
        <div class="modal-contain">
          <div class="model-tab">
                <span  v-for="(item ,index) in tabD"
                       :class="{'tabActive':tabcur === index}"
                       @click="tabItme(item,index)"> {{ item }}</span>

        </div>
          <router-view/>
        </div>
      </div>

    </div>
    <br /><br /><br />
  </div>
</div>
</template>

<script>
    export default {
        name: "Home",
      data(){
        return{
          tabcur:0,
          tabD: ["地图模式", "行业模式","园区模式"],

        }
      },
      methods: {
        search(){

        },
        tabItme(item, index) {
          this.tabcur = index;
          switch (index) {
            case 0:
              this.$router.push({path: '/Pages/CompanyList/Home/Map'})
              break;
            case 1:
              this.$router.push({path: '/Pages/CompanyList/Home/Industry'})
              break;
            case 2:
              this.$router.push({path: '/Pages/CompanyList/Home/Zone'})
              break;
          }
        },
      }
    }
</script>

<style scoped>
  .form-group{
    display: flex;
    justify-content: center;
    align-items: baseline;
  }
.tabActive{
  color: rgba(21,117,249,1);
}
  .com-search {
    font-size: 20px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
  }
  .model-tab{
    margin-bottom: 30px;
  }
  .model-tab span{
    margin-right: 80px;
  }
  .modal-contain{
    padding: 0 20px;
  }
</style>
